//导入gulp模块
const { series, src, dest, watch } = require('gulp');


//导入插件
const uglify = require('gulp-uglify')//js压缩
const rename = require("gulp-rename")//改后缀名
const less = require("gulp-less")//less转css
const cleanCss = require("gulp-clean-css")//css压缩
const imagemin = require("gulp-imagemin")//图片压缩
const webserver = require('gulp-webserver');

//定义任务
function jsTask() {
    return src('./js/**/*.js')//js源码的地址
        .pipe(uglify())//进行压缩处理
        .pipe(rename({
            suffix: ".min",//文件名的后缀
        }))
        .pipe(dest('./dest/js'))//处理后放置的地方
}

function cssTask() {
    return src('./less/**/*.less')//less源码的地址
        .pipe(less())//less转css
        .pipe(cleanCss())//进行压缩处理
        .pipe(rename({
            suffix: ".min",//文件名的后缀
        }))
        .pipe(dest('./dest/css'))//处理后放置的地方
}

function imgTask() {
    return src('./images/**/*.{png,jpg,gif,ico}')//图片的地址
        .pipe(imagemin())//压缩图片
        .pipe(dest('./dest/imgs'))//处理后放置的地方
}

//上帝之眼
function watchTask() {
    watch('./js/**/*.js', {
        events: ['add', 'change']
    }, jsTask);
    watch('./less/**/*.less', {
        events: ['add', 'change']
    }, cssTask);
    watch('./images/**/*.{png,jpg,gif,ico}', {
        events: ['add', 'change']
    }, imgTask);
}


//本地服务器
function serve(){
    return src('/')
        .pipe(webserver(
            {
                livereload: true,//热更新 会自动刷新页面
                //directoryListing: true,//显示目录列表
                open: true,//在浏览器中打开localhost服务器
                port:8080
              }
        ))
}

    exports.default=series(serve,watchTask)
    //导出
    // exports.jsTask = jsTask;
    // exports.cssTask = cssTask;
    // exports.imgTask = imgTask;
    // exports.watchTask = watchTask;